import React from 'react';
import { useSelector, useDispatch } from 'react-redux'   //导入两个hooks
import { IRootReducer } from '@/store'   //导入store的入口文件的state的类型
//导入 count中的两个actionCreator
import { addAction, subAction } from '@/store/count'
import { Button, Space } from 'antd';

const Test = () => {
    const dispatch = useDispatch()  //拿到store中的dispatch函数，触发action
    const count = useSelector((state: IRootReducer) => {  //拿到store中的state
        return state.countReducer.count
    })
    const add = () => {
        dispatch(addAction(10))   //点击触发action
    }
    const sub = () => {
        dispatch(subAction(10))
    }

    return (
        <div>
            1111
            <h1>{count}</h1>


            <Space wrap>
                <Button type="primary" onClick={add}>加 +10</Button>
                <Button onClick={sub}>减 -10</Button>
            </Space>
        </div>
    );
};

export default Test;
